let option_pie = {
    title: {
        text: '电影评分占比',
        left: 'center',
        top: '3%'
    },
    grid: {
        left: "5",
        right: '5',
        bottom: '10',
        containLabel: true
    },
    legend: {
        type: 'scroll',
        bottom: 'bottom',
        left: 'center'
    },
    tooltip: {
        trigger: 'item',
        // formatter: '{a} <br/>{b} : {c} ({d}%)'
    },
    animationDelay: function (idx) {
        return idx * 150;
    },
    series: [
        {
            name: '评分占比',
            type: 'pie',
            radius: '60%',
            itemStyle: {
                borderRadius: 20,
                borderColor: '#fff',
                borderWidth: 2
            },
            label: {
                show: true,
                position: 'outside',
                fontSize: 12,
                fontWeight: 'normal'
            },
            labelLine: {
                show: true,
                smooth: true
            },
            emphasis: {
                label: {
                    show: true,
                    fontSize: 25,
                    fontWeight: 'bold'
                }
            },
        }
    ]
}

let option_bar = {
    title: {
        text: '电影评分TOP10',
        left: 'center',
        top: '3%'
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'shadow'
        },
        config: true,
        valueFormatter: function (value) {
            return value + '分';
        }
    },
    grid: {
        top: '13%',
        left: '1%',
        right: '5%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: [
        {
            type: 'value',
            axisLine: {
                symbol: "none",
                show: true
            },
            mix: 'dataMix',
            min: function (value) {
                if (value.min >= 1) {
                    return value.min - 0.5;
                }
                return value.min;
            },
        }
    ],
    yAxis: [
        {
            type: 'category',
            inverse: true,
            axisLine: {
                symbol: "none",
                show: true
            },
            axisTick: {
                alignWithLabel: true
            },
            axisPointer: {
                type: 'line'
            },
            animationDuration: function (idx) {
                return idx * 150;
            },
            animationDelay: function (idx) {
                return idx * 200;
            }
        }
    ],
    series: [
        {
            name: '评分TOP10',
            type: 'bar',
            barWidth: '60%',
            realtimeSort: true,
            label: {
                show: true,
                position: 'right',
                fontSize: 12,
            }
        }
    ]
}

let option_scatter = {
    title: {
        text: '影片评分与时长关系',
        left: 'center',
        top: '3%'
    },
    grid: {
        top: '13%',
        left: '1%',
        right: '5%',
        bottom: '3%',
        containLabel: true
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'cross'
        },
        config: true,
        formatter: function (params) {
            return `${params[0].marker} ${params[0].seriesName}<br>
            评分: ${params[0].value[1]} 分<br>时长: ${params[0].value[0]} 分钟`
        }
    },
    xAxis: {
        type: "value",
        scale: true,
        axisLabel: {
            formatter: "{value} 分钟"
        },
        splitLine: {
            show: false
        }
    },
    yAxis: {
        type: "value",
        scale: true,
        axisLabel: {
            formatter: "{value} 分"
        },
        splitLine: {
            show: false
        }
    },
    series: [
        {
            name: "影评与时长",
            type: 'scatter',
            symbol: 'pin',
            symbolSize: 17,
            large: true
        }
    ]
}

let option_line = {
    title: {
        text: '电影上映年份分布',
        left: 'center',
        top: '3%'
    },
    grid: {
        top: '13%',
        left: '1%',
        right: '5%',
        bottom: '3%',
        containLabel: true
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'cross'
        },
        config: true,
        valueFormatter: function (value) {
            return value + '部';
        }
    },
    xAxis: {
        type: 'category',
        inverse: true,
    },
    yAxis: {
        type: 'value',
        axisLine: {
            symbol: "none",
            show: true
        },
    },
    series: [
        {
            type: 'line',
            smooth: true,
            animation: true,
            realtimeSort: true,
        }
    ]
};

let option_treemap = {
    title: {
        text: '电影类型图',
        left: 'center',
        top: '3%'
    },
    series: [
        {
            name: '电影类别',
            type: 'treemap',
            top: '13%',
            left: '2%',
            right: '2%',
            bottom: '5%',
            label: {
                show: true,
                formatter: '{b}\n{c}',
                fontSize: 15,
            }
        }
    ]
};

const makeImage = new Image();
makeImage.src = '/static/img/xin.png';
let option_wordcloud = {
    title: {
        text: '电影评分人数',
        left: 'center',
        top: '3%'
    },
    tooltip: {
        trigger: 'item',
        triggerOn: 'mousemove',
        valueFormatter: function (value) {
            return value.toLocaleString() + '人';
        }
    },
    series: [{
        name: '电影评分人数',
        type: 'wordCloud',
        layoutAnimation: true,
        size: ['9%', '99%'],
        sizeRange: [10, 90],
        left: 'center',
        top: 'center',
        width: '100%',
        height: '100%',
        right: null,
        bottom: null,
        gridSize: 1,
        shrinkToFit: false,
        textRotation: [0, 45, 90, -45],
        rotationRange: [-45, 90],
        shape: 'cardioid',
        // maskImage: makeImage,
        textPadding: 0,
        autoSize: {
            enable: true,
            minSize: 6
        },
        textStyle: {
            normal: {
                color: function () {
                    return 'rgb(' + [
                        Math.round(Math.random() * 160),
                        Math.round(Math.random() * 160),
                        Math.round(Math.random() * 160)
                    ].join(',') + ')';
                }
            },
            emphasis: {
                shadowBlur: 10,
                shadowColor: '#333'
            }
        },
        data: [{'name': '正在加载中', 'value': 1000}]
    }]
}